<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="description" content="">
    <meta name="author" content="">
    <link rel="shortcut icon" href="../assets/img/logo-fav.png">
    <title>Alice CodeCreator</title>
    <link rel="stylesheet" type="text/css" href="../assets/lib/perfect-scrollbar/css/perfect-scrollbar.css"/>
    <link rel="stylesheet" type="text/css" href="../assets/lib/material-design-icons/css/material-design-iconic-font.min.css"/>
    <!-- nice-validator 1.1.4 -->
    <link rel="stylesheet" type="text/css" href="../assets/lib/niceValidator/jquery.validator.css"/>
    <link rel="stylesheet" href="../assets/css/app.css" type="text/css"/>
</head>
<body class="be-splash-screen">
<div class="be-wrapper be-login be-signup">
    <div class="be-content">
        <div class="main-content container-fluid">
            <div class="splash-container sign-up">
                <div class="card card-border-color card-border-color-primary">
                    <div class="card-header">
                        <div class="center">
                            <img class="logo-img" src="../assets/img/logo.png" alt="logo" width="318" height="120">
                        </div>
                        <span class="splash-description"></span>
                    </div>
                    <div class="card-body">
                        <form id="registerForm">
                            <div class="form-group">
                                <div class="input-group input-group-sm">
                                    <div class="input-group-prepend">
                                        <span class="input-group-text"><span style="color:red;">* </span>账号</span>
                                    </div>
                                    <input class="form-control" type="text" id="userAccount" name="userAccount" placeholder="请输入字母和数字" autocomplete="off">
                                </div>
                            </div>

                            <div class="form-group">
                                <div class="input-group input-group-sm">
                                    <div class="input-group-prepend">
                                        <span class="input-group-text"><span style="color:red;">* </span>密码</span>
                                    </div>
                                    <input class="form-control" type="password" id="userPassword" name="userPassword" placeholder="请输入密码，建议由字母、数字和符号组成" autocomplete="off">
                                </div>
                            </div>

                            <div class="form-group">
                                <div class="input-group input-group-sm">
                                    <div class="input-group-prepend">
                                        <span class="input-group-text"><span style="color:red;">* </span>确认密码</span>
                                    </div>
                                    <input class="form-control" type="password" id="replayUserPassword" name="replayUserPassword" placeholder="请再次输入密码" autocomplete="off">
                                </div>
                            </div>

                            <div class="form-group">
                                <button id="registerButton" class="btn btn-block btn-primary btn-xl" type="button">注册</button>
                            </div>
                        </form>
                    </div>
                </div>
                <div class="splash-footer"><span>返回 <a href="../login.html">登录</a></span></div>
                <div class="splash-footer">Application &copy; 2020 - 2022 Powered By <a href="https://liuxp.me" target="_blank">liuxp.me</a></div>
            </div>
        </div>
    </div>
</div>
<script src="../assets/lib/jquery/jquery.min.js" type="text/javascript"></script>
<!-- nice-validator 1.1.4 -->
<script src="../assets/lib/niceValidator/jquery.validator.min.js?local=zh-CN"></script>
<script src="../assets/lib/perfect-scrollbar/js/perfect-scrollbar.min.js" type="text/javascript"></script>
<script src="../assets/lib/bootstrap/dist/js/bootstrap.bundle.min.js" type="text/javascript"></script>
<!-- layer弹出层 -->
<script src="../assets/lib/layer/layer.js"></script>
<script src="../assets/js/app.js" type="text/javascript"></script>
<script src="../assets/js/common.js" type="text/javascript"></script>
<script type="text/javascript">
    $(function () {
        App.init();

        // 初始化表单验证
        $('#registerForm').validator({
            timely: 2,
            theme:'yellow_right',
            target: function(input) {
                var $formitem = $(input).closest('div.form-group'),
                    $msgbox = $formitem.find('span.msg-box');
                if (!$msgbox.length) {
                    $msgbox = $('<span class="msg-box"></span>').appendTo($formitem);
                }
                return $msgbox;
            },
            fields: {
                'userAccount': 'required',
                'userPassword': '密码:required;password;',
                'replayUserPassword': '确认密码:match(userPassword);'
            }
        });

        // 绑定注册按钮点击事件
        $("#registerButton").click(function () {
            $("#registerForm").isValid(function(isValid) {
                if(isValid){
                    $.alicej.util.ajax({
                        type: "POST",
                        url: '/register',
                        data: $.alicej.util.serialize("#registerForm"),
                        dataType: 'json',
                        success: function (rsp) {
                            if (rsp.success) {
                                $.alicej.util.bootbox.alert("注册成功，点击确定进入平台！", function () {
                                    // 自动登录
                                    var params = {
                                        'j_username':$("#userAccount").val(),
                                        'j_password':$("#userPassword").val()
                                    };

                                    form_post("/j_spring_security_check",params);

                                });
                            } else {
                                $.alicej.util.bootbox.showWarn(rsp.message,"注册失败");
                            }
                        }
                    });
                }
            });
        });

    });

    /*
     * 功能： 模拟form表单的提交
     * 参数： URL 跳转地址 PARAMTERS 参数
     */
    function form_post(URL, PARAMTERS) {
        // 创建form表单
        var temp_form = document.createElement("form");
        temp_form.action = URL;
        // 如需打开新窗口，form的target属性要设置为'_blank'
        temp_form.target = "_self";
        temp_form.method = "post";
        temp_form.style.display = "none";
        // 添加参数
        for (var item in PARAMTERS) {
            var opt = document.createElement("textarea");
            opt.name = item;
            opt.value = PARAMTERS[item];
            temp_form.appendChild(opt);
        }
        document.body.appendChild(temp_form);
        //提交数据
        temp_form.submit();
    }

</script>
</body>
</html>